<template>
  <div class="box-content">
    <div class="navigation">数据展示</div>
    <el-form :model="form" :rules="rules" ref="form" label-width="100px" >
      <el-form-item label="日期选择" prop="date">
        <el-date-picker
          v-model="form.date"
          size="small"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"
          @change="submitSearch">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="跳转前台首页">
        <el-button type="primary" @click="submitCostomer('form')">跳转</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  name: 'index',
  components: {
  },
  data(){
    return{
        form:{
            date:[],
            userInfo:{},
            token:''
        },
        rules: {
            date: [
                {required: 'true', message: '请选择日期', trigger: 'change'}
            ]
        }
    }
  },
  mounted() {
      this.userInfo = JSON.parse(localStorage.getItem('userInfo'));
      this.token = localStorage.getItem('token');
  },
  methods: {
      submitSearch() {
          console.info(this.form.date)
      },
      submitCostomer(formName) {
          this.$refs[formName].validate((valid) => {
              if (valid) {
                  this.turnToIndex();
              } else {
                  return false;
              }
          });
      },
      turnToIndex() {
          // window.localStorage.setItem('date',this.form.date);
          window.location.href = 'http://web.tourism.test.adbpx.com/index.html?date='
              + JSON.stringify(this.form.date) + '&token=' + this.token + '@tr_id=' + this.userInfo;
          // window.open('http://web.tourism.test.adbpx.com/index.html');
      }
  }
};
</script>

<style scoped>

</style>